<template>
    <div class="app-container">
        <el-table v-loading="loading" :data="kzList">
            <el-table-column label="客资编号" align="center" prop="kzResource" />
            <el-table-column label="客资姓名" align="center" prop="kzName" />
            <el-table-column label="联系方式" align="center" prop="kzTel" />
            <el-table-column label="微信号" align="center" prop="kzWechat" />
            <el-table-column label="服务种类" align="center" prop="serveType" />
            <el-table-column label="当前状态" align="center" prop="typeid">
                <template slot-scope="scope">
                    <span v-if="scope.row.typeid == 0">待领取</span>
                    <span v-if="scope.row.typeid == 1">已领取</span>
                    <span v-if="scope.row.typeid == 2">活动锁单</span>
                    <span v-if="scope.row.typeid == 3">订单成交</span>
                    <span v-if="scope.row.typeid == 4">转让客资</span>
                    <span v-if="scope.row.typeid == 5">放弃客资</span>
                    <span v-if="scope.row.typeid == 6">取消订单申请</span>
                    <span v-if="scope.row.typeid == 8">取消订单成功</span>
                    <span v-if="scope.row.typeid == 9">取消订单失败</span>
                    <span v-if="scope.row.typeid == 10">退回客资申请</span>
                    <span v-if="scope.row.typeid == 11">退回客资成功</span>
                    <span v-if="scope.row.typeid == 12">退回客资失败</span>
                </template>
            </el-table-column>
            <el-table-column label="分配时间" align="center" prop="fenpeitime">
                <template slot-scope="scope">
                    <span>{{ parseTime(scope.row.fenpeitime, '{YY}-{MM}-{DD} {hh}:{mm}:{ss}') }}</span>
                </template>
            </el-table-column>
            <el-table-column label="凭证或图片" align="center" prop="img">
                <template slot-scope="scope">
                    <div v-for="(item, index) in srcList">
                        <span v-if="scope.row.img == ''">{{ '暂无' }}</span>
                        <el-image v-else :key="index" :src="item" alt="" weight="20" :preview-src-list="srcList"
                            style="width:40px;"></el-image>
                    </div>

                </template>
            </el-table-column>
        </el-table>
    </div>
</template>
<script>
import { selectQXDDxiangq } from "@/api/kuser/cancelorder.js";
export default {
    data() {
        return {
            srcList: [],
            kzList: [],
            loading: true,
            date: {
                kzId: this.$route.query.kzId,
                shopid: this.$route.query.shopid
            }
        }
    },
    created() {
        this.getList();
    },
    methods: {
        async getList() {
            let res = await selectQXDDxiangq(this.date);
            if (res.code == 200) {
                this.srcList = res.data.data.img.split(',');
                this.kzList.push(res.data.data);
                this.loading = false;
            }
        }
    }
}
</script>